import Qt 4.7
import QtQuick 1.0

Item {
  id: loginDialog
  visible: false
  width: 360
  height: inputrect.height + passwordrect.height + 30 + title.height + 10 + button.height

  signal login()

  property string username: ""
  property string password: ""

  Rectangle {
    radius: 5
    border.width: 1
    border.color: "#aaa"
    width: 360
    height: parent.height
    color: "#ffffff"

    Text {
      id: title
      x: 5
      y: 5
      text: "Login into Plurk "
    }

    Text {
      x: 5
      y: title.height + 20
      id: usertext
      text: "Username"
    }
    Rectangle {
      id: inputrect
      x: usertext.width + 5
      y: usertext.y
      radius: 5
      border.width: 1
      border.color: "#aaa"
      width: parent.width - usertext.width - 10
      height: userinput.height + 10
      smooth: true

      TextInput {
        id: userinput
        x: 5
        y: 5
        width: parent.width - 10
        text: "text"
        focus: true
      }
    }

    Text {
      x: 5
      y: inputrect.y + inputrect.height + 15
      id: passwordtext
      text: "Password"
    }

    Rectangle {
      id: passwordrect
      x: usertext.width + 5
      y: passwordtext.y
      radius: 5
      width: parent.width - usertext.width - 10
      height: passwordinput.height + 10
      border.width: 1
      border.color: "#aaa"
      smooth: true

      TextInput {
        id: passwordinput
        x: 5
        y: 5
        text: "password"
        width: parent.width - 10
        echoMode: TextInput.Password
      }
    }

    Item {
      id: button
      x: 5
      y: passwordrect.y + passwordrect.height + 15
      width: parent.width
      height: loginButton.height + 15

      Button {
        id: loginButton
        label: "Login"
        x: 0
        y: 0
        width: parent.width / 2 - 15
        onClicked: {
                console.log("Login Button Clicked");
          username = userinput.text;
          password = passwordinput.text;
          loginDialog.visible = false;
          loginDialog.login();
        }
      }

      Button {
        id: cancelButton
        label: "Cancel"
        x: loginButton.x + loginButton.width + 15
        y: 0
        width: parent.width / 2 - 15
        onClicked: {
                console.log("Cancel Button Clicked");
          passwordinput.text = "";
        }
      }
    }
  }
}
